<template>
  <div class="notice">
    <div class="recent-news">
      <div
        class="news-item"
        v-for="item in noticeList"
        :key="item.id"
        @click="goNewNotice(item.id)"
      >
        <div class="news-item-title">
          {{ item.title }}
        </div>
        <div class="news-item-date">
          {{ item.publishTime }}
        </div>
        <div class="item-after"></div>
      </div>
    </div>
  </div>
</template>

<script>
import { getNoticeList } from "@/services/index";
export default {
  data() {
    return {
      noticeList: [],
    };
  },
  async created() {
    let res = await getNoticeList();
    this.noticeList = res.records;
  },
  methods: {
    goNewNotice(id) {
      wx.navigateTo({
        url: `../noticeDateils/index?id=${id}`,
      });
    },
  },
};
</script>

<style>
.notice {
  height: 2rpx;
  background-color: #e1e1e1;
  left: 20rpx;
  display: block;
}
.recent-news {
  background: #fff;
}
.news-item {
  padding: 20rpx 20rpx 0 20rpx;
  position: relative;
}
.news-item-title {
  font-size: 28rpx;
  text-align: left;
}
.news-item-date {
  font-size: 24rpx;
  color: #999;
  text-align: right;
  margin-top: 10rpx;
  margin-bottom: 20rpx;
}
.item-after {
  content: " ";
  width: 100%;
  height: 2rpx;
  background-color: #e1e1e1;
  left: 20rpx;
  display: block;
  position: absolute;
}
</style>